<template>
  <dys-modal :open="open" :width="1200" :title="t('功能权限')" :footer="false">
    <a-row>
      <a-col :span="8">
        <a-card :title="t('权限')" size="small">
          <permission-table
            ref="permissionTableRef"
            :function-id="model?.functionId"
          ></permission-table>
        </a-card>
      </a-col>
      <a-col :span="16">
        <a-card :title="t('接口')" size="small">
          <api-table
            :permission-id="
              permissionTableRef?.rowSelection.selectedRowKeys[0] as string
            "
          ></api-table>
        </a-card>
      </a-col>
    </a-row>
  </dys-modal>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n";
import type { QueryResult } from "@/api/system/permission/typing";
import ApiTable from "./api-table.vue";
import PermissionTable from "./permission-table.vue";
interface Props {
  /**弹窗 */
  open: boolean;
  /**行数据 */
  model: QueryResult;
}
defineProps<Props>();
const { t } = useI18n();
const permissionTableRef = ref<InstanceType<typeof PermissionTable>>();
</script>
